<%@ page pageEncoding="UTF-8"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="isperp" uri="/WEB-INF/tlds/isperp.tld"%>
<style type="text/css">
</style>
<form:form commandName="model" cssClass="validate"
	action="wechat/mp/menu/save">
	<form:hidden path="id" />
	<table class="form-table">
		<tbody>
			<tr>
				<td class="td1">父级菜单：</td>
				<td class="td2"><form:input path="parentId" cssClass="hidden" />
					<isperp:treeSelector id="selectParentMenu"
						url="wechat/mp/menu/getTree" valueControlId="parentId"
						displayValue="${parentName}" displayValueCssClass="required"></isperp:treeSelector>
				</td>
			</tr>
			<tr>
				<td class="td1">名称：</td>
				<td class="td2"><form:input path="name" cssClass="required" />
				</td>
			</tr>
			<tr>
				<td class="td1">是否需要登录：</td>
				<td class="td2"><form:checkbox path="needAccount" /></td>
			</tr>
			<tr>
				<td class="td1">响应动作类型：</td>
				<td class="td2"><form:select path="menuType"
						onchange="menuTypeOnchange()">
						<form:option value="click">点击事件</form:option>
						<form:option value="view">超链接</form:option>
					</form:select>
				</td>
			</tr>
			<tr>
				<td class="td1">菜单key：</td>
				<td class="td2"><form:input path="menuKey" />
				</td>
			</tr>
			<tr id="trUrl">
				<td class="td1">菜单链接：</td>
				<td class="td2"><form:input path="url" cssStyle="width:85%" />
				</td>
			</tr>
			<tr id="trReplayType">
				<td class="td1">回复类型：</td>
				<td class="td2"><form:radiobutton
						onchange="replayTypeOnchange()" value="" path="replayType"
						label="无" /> <form:radiobutton onchange="replayTypeOnchange()"
						value="text" path="replayType" label="文本" /> <form:radiobutton
						onchange="replayTypeOnchange()" value="news" path="replayType"
						label="图文" /> <form:radiobutton onchange="replayTypeOnchange()"
						value="customer" path="replayType" label="自定义" /><label
					class="required"></label>
				</td>
			</tr>
			<tr id="trMessageContent">
				<td class="td1">回复内容：</td>
				<td class="td2"><textarea id="messageContentArea"
						name="messageContentArea">${model.messageContent }</textarea>
					<div id="messageContentTableDiv">
						<form:hidden path="newsId" />


						<isperp:listSelector id="newsSelector" showClearBtn="true"
							valueControlId="newsId" url="wechat/news/list"
							displayColumn="title" displayValue="${model.messageContent }"
							name="newsTitle">
							<isperp:column name="id" title="id" hidden="true"></isperp:column>
							<isperp:column name="title" title="标题" width="220">
							</isperp:column>
							<isperp:column name="creatorName" title="创建者" width="100">
							</isperp:column>
							<isperp:column name="createDate" title="创建时间" width="110">
							</isperp:column>
							<isperp:column name="orderNum" title="排列顺序" width="50">
							</isperp:column>

						</isperp:listSelector>
					</div>


					<div id="messageContentTableDiv2">
						<p style="font-weight: bold;">支持参数:openid,contextUrl,config(配置项内容)</p>
						<p>1.回复类型为“无”，则不回复用户的消息；</p>
						<p>2.文本直接输入文本内容；</p>
						<p>3.如果是自定义，请输入自定义的SpringBean及其方法（注意，此方法必须可以返回一个OutMessage）；</p>
					</div></td>
			</tr>

			<tr>
				<td class="td1">排序：</td>
				<td class="td2"><form:input path="orderNum" cssClass="number" />
				</td>
			</tr>
		</tbody>
	</table>
</form:form>
<isperp:buttonList>
	<button class="submit" onclick="isperp.submitForm();return false;">
		<span class="icon icon-save"></span>提交
	</button>
</isperp:buttonList>



<script type="text/javascript">
	$(document).ready(function() {
		menuTypeOnchange();
	});

	var rowTemplate = '<tr>' + '<td><input type="text" name="messageContentTitle">' + '</td>' + '<td><input type="text" name="messageContentDesc">' + '</td>' + '<td><input type="text" name="messageContentPicurl">' + '	<a class="nui-txt-link" href="">上传</a></td>' + '<td><input type="text" name="messageContentUrl"></td>' + '<td><span class="ui-icon ui-icon-trash"' + '	onclick="removeMessageContentRow(this)"></span>' + '</td>' + '</tr>';

	function createMessageContentRow() {
		$("#messageContentTable").append(rowTemplate);
	}

	function removeMessageContentRow(obj) {
		$(obj).parent().parent().remove();
	}

	function menuTypeOnchange() {
		var obj = document.getElementById("menuType");
		if (obj.value == "view") {
			$("#trUrl").show();
			$("#trReplayType,#trMessageContent").hide();
		} else {
			$("#trReplayType,#trMessageContent").show();
			$("#trUrl").hide();
		}

		replayTypeOnchange();
	}

	function replayTypeOnchange() {
		var value = $("input[name='replayType']:checked").val();
		if (value == "") {
			$("#trMessageContent").hide();
		} else if (value == "text" || value == "customer") {
			$("#messageContentTableDiv").hide();
			$("#messageContentTableDiv2").show();
			$("#trMessageContent,#messageContentArea").show();
		} else if (value == "news") {
			$("#messageContentArea").hide();
			$("#trMessageContent,#messageContentTableDiv").show();
			$("#messageContentTableDiv2").hide();

		}
	}
</script>